<!doctype html>
<html>

<head>
  <meta charset="utf-8">
  <title>执行待办</title>
  <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
  <link href="../../../css/mui.min.css" rel="stylesheet" />
  <link href="../css/common.css" rel="stylesheet" />
  <style>
    .mui-card {
      border-radius: 5px;
      box-shadow: none;
      padding: 20px;
      color: #333333;
      line-height: 30px;
    }
  </style>
</head>

<body>
  <div id="container" v-cloak>
    <header class="mui-bar mui-bar-nav">
      <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
      <h1 class="mui-title">{{type=='reminders'? '工作提醒' : '操作须知'}}</h1>
    </header>
    <div class="mui-content app-container">
      <div id="slider" class="mui-slider mui-fullscreen">
        <div class="tab-content mui-slider-group" id="tab-content">
          <div id="item1" class="mui-slider-item mui-control-content mui-active">
            <div class="mui-card">
              <div v-if="type=='instruction' && tipsInfo.instruction">
                {{tipsInfo.instruction.remarks}}
              </div>
              <div v-if="type=='reminders'">
                <ul v-for="(item,index) in tipsInfo.reminders" v-cloak>
                  <li>{{item.remarks}}</li>
                </ul>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

  </div>

  <script src="../../../js/mui.js"></script>
  <script src="../../../js/mui.pullToRefresh.js"></script>
  <script src="../../../js/mui.pullToRefresh.material.js"></script>
  <script src="../../../js/jquery-1.7.2.min.js"></script>
  <script src="../../../js/vue.js"></script>
  <script src="../js/mkeyplus.base.js"></script>
  <script src="../js/indexDBs.js"></script>
  <script type="text/javascript">
    let self = null;
    var ids = 0;
    var lineType = null;
    var db = {};
    const dbName = 'myDB'; // 数据库的名字
    const storeName = 'processPackage'; //仓库名称
    mui.init()
    mui.plusReady(async function () {
      self = plus.webview.currentWebview();
      vm.type = window.location.search.split('=')[1];
      ids = self.ids;
      //getProject(page)
      lineType = getSysInfo();
      // const dbName = 'myDB', storeName = 'processPackage'
      await openDB(dbName, storeName, 2).then(res => {
        console.log('111', res)
        db = res
        // return res
      })
      if (!lineType) {
        getLineData()
        return
      }
      vm.getTipsInfo()
    })

    var vm = new Vue({
      el: '#container',
      data: {
        type: '',
        tipsInfo: {},
      },
      created: function () {
        this.type = this.getUrlParams('type')
        console.log(location.href)
        // this.getTipsInfo()
      },
      methods: {
        getUrlParams (name) {
          var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
          var r = window.location.search.substr(1).match(reg);
          if (r != null) return unescape(r[2]);
          return null;
        },
        getTipsInfo () {
          mui.baseApp.httpRequst("get", "/app/api/project/execution/tips", {}, (data) => {
            console.log(data)
            this.tipsInfo = data.data
          }, () => {
            console.log("获取数据失败");
          })
        }
      }
    });
    // 获取离线数据
    function getLineData () {
      getDataByKey(db, storeName, ids).then(res => {
        console.log('33300', JSON.stringify(res), vm.type)
        vm.tipsInfo = res.tips
        // this.tipsInfo = res.data
      })
    }
    function getSysInfo () {
      types = {};
      types[plus.networkinfo.CONNECTION_UNKNOW] = "未知";
      types[plus.networkinfo.CONNECTION_NONE] = "未连接网络";
      types[plus.networkinfo.CONNECTION_ETHERNET] = "有线网络";
      types[plus.networkinfo.CONNECTION_WIFI] = "WiFi网络";
      types[plus.networkinfo.CONNECTION_CELL2G] = "2G蜂窝网络";
      types[plus.networkinfo.CONNECTION_CELL3G] = "3G蜂窝网络";
      types[plus.networkinfo.CONNECTION_CELL4G] = "4G蜂窝网络";

      var str = types[plus.networkinfo.getCurrentType()];
      if (str == '未知' || str == '未连接网络') {
        return false;
      } else {
        return true;
      }

    }

  </script>
</body>

</html>